﻿package app.demo.MyTouchApp{
 
    import flash.events.TUIO; // allows to connect to touchlib/tbeta
 
    import flash.display.*;
    import flash.events.*;
	import flash.events.MouseEvent;
    import flash.geom.*; // needed for curPt;
	import flash.display.SimpleButton;
	import flash.net.URLRequest;
	import flash.display.FrameLabel;
	import fl.controls.Label;
	import fl.controls.*;
	import fl.core.*;
	//import mx.controls.Label;
	import flash.display.Sprite;
	import flash.text.*;
	import flash.system.fscommand;
	import flash.system.*;	
 
    public class topicMatching extends MovieClip {
 
        private var color:uint = 0xff0000; // color of lines
        private var thickness:Number = 30; // thickness of lines
        private var blobs:Array = new Array(); // blobs we are currently interacting with
        private var lines:Array = new Array(); // array to hold the lines
		public var button:SimpleButton;
		public var button2:SimpleButton;
		public var button3:SimpleButton;
		private var numButtonWidth:Number = 100;
		private var numButtonHeight:Number = 50;
		private var images:Array = ["matching1.png", "darkBackground.png", "Topic.png"];
		var image1:Loader = new Loader();
		var image3:Loader = new Loader();
		var image4:Loader = new Loader();
		var image5:Loader = new Loader();
		//var label:Object=new Object(); 
		var myLabel:Label = new Label();
		var Label1:Label = new Label();
		//var myLabel:FrameLabel = new FrameLabel(
		var movie1:MovieClip = new MovieClip();
		var movie2:MovieClip = new MovieClip();
		var square:Sprite = new Sprite();
		var buttonPlay:Button;
		var buttonInstructions:Button;
		var buttonExit:Button;
		var buttonBack:Button;
		
		var myMaster:master;
		
 		var topic:Loader= new Loader();
        public function topicMatching(m:master):void {
			
			fscommand("allowscale", "false");
			fscommand("fullscreen", "false");
			//Stage.showMenu = false;
 
 			myMaster=m;
			
            //--------connect to TUIO-----------------
            TUIO.init(this,'localhost',3000,'',true);
            trace("MyTouchApp Initialized");
            //---------------------------------------- 
 			
			//Adding the first movie
			addChild(movie1);
			
            //addEventListener(TouchEvent.MOUSE_DOWN, downEvent, false, 0, true); // run when finger down
            addEventListener(TouchEvent.MOUSE_UP, upEvent, false, 0, true); // run when finger up
            addEventListener(Event.ENTER_FRAME, updater, false, 0, true); // keep running
			//start();
			button = new SimpleButton;
			button2= new SimpleButton;
			button3= new SimpleButton;
			
			//Image 1
			
			image1.load(new URLRequest(images[0]));
			image1.x=160;
			image1.y=210;
			image1.scaleX=0.7;
			image1.scaleY=0.7;
			//image1.height=300;
			
			movie2.addChild(image1);
			image1.addEventListener(TouchEvent.MOUSE_DOWN,goToSelectAvatar);
			
			
			buttonPlay= new Button();
			buttonPlay.x=640;
			buttonPlay.y=250;
			buttonPlay.width=200;
			buttonPlay.height=40;
			buttonPlay.label="PLAY";
			buttonPlay.addEventListener(TouchEvent.MOUSE_DOWN,goToSelectAvatar);
			
			buttonInstructions = new Button();
			buttonInstructions.x=640;
			buttonInstructions.y=350;
			buttonInstructions.width=200;
			buttonInstructions.height=40;
			buttonInstructions.label="INSTRUCTIONS";
			buttonInstructions.addEventListener(TouchEvent.MOUSE_DOWN,instructions);
			
			buttonExit = new Button();
			buttonExit.x=640;
			buttonExit.y=450;
			buttonExit.width=200;
			buttonExit.height=40;
			buttonExit.label="EXIT";
			buttonExit.addEventListener(TouchEvent.MOUSE_DOWN,closeApp);
			
			buttonBack = new Button();
			buttonBack.width=100;
			buttonBack.height=40;
			buttonBack.label="BACK";
			buttonBack.addEventListener(TouchEvent.MOUSE_DOWN,goToMain);
			
			// image 2
			var image2:Loader = new Loader();
			image2.load(new URLRequest(images[1]));
			//image2.alpha = 0;
			image2.scaleX=1.4;
			//image2.scaleY=1.13;
			movie1.addChild(image2);
			
			
			/*///////////////////////////
			//Image 3
			
			image3.load(new URLRequest(images[2]));
			image3.x=550;
			image3.y=240;
			image3.scaleX=0.5;
			image3.scaleY=0.5;
			//image1.height=300;
			
			//movie1.addChild(image3);
			image3.addEventListener(TouchEvent.MOUSE_DOWN,goToSelectAvatar);
			/////////////////////
			
			////// image 4
			image4.load(new URLRequest(images[3]));
			image4.x=550;
			image4.y=320;
			image4.scaleX=0.5;
			image4.scaleY=0.5;
			
			
			//movie1.addChild(image4);
			//image4.addEventListener(TouchEvent.MOUSE_DOWN,imageMethod);
			
			////// image 5
			image5.load(new URLRequest(images[4]));
			image5.x=550;
			image5.y=400;
			image5.scaleX=0.5;
			image5.scaleY=0.5;
			
			
			//movie1.addChild(image5);
			//image5.addEventListener(TouchEvent.MOUSE_DOWN,imageMethod);
*/			
			
			
			
			var myTextFormat:TextFormat = new TextFormat();
			myTextFormat.font = "Kristen ITC";
			myTextFormat.size = 70;
			 
			////////////////////////////////
			Label1.text = "Topic Matching";
			Label1.width=600;
			Label1.height=300;
			Label1.x=260;
			//Label1.y=60;
			//Label1.textField.background = true;
			//Label1.textField.backgroundColor = 0x000000;
			Label1.visible=true;
			Label1.setStyle("textFormat", myTextFormat);
			//myLabel.move(10, 10);
			//movie1.addChild(Label1);
			
			topic.load(new URLRequest(images[2]));
			topic.x=240;
			topic.y=-20;
			topic.scaleX=1.1;
			topic.scaleY=1.1;
			movie1.addChild(topic);
			
			
			// Create a new instance of the Font1 symbol from the document's library.  
			//var myFont:Font = new MyFont();
			 
			// Create a new TextFormat object, and set the font and size properties.
			/*var myTextFormat:TextFormat = new TextFormat();
			myTextFormat.font = "Verdana";
			myTextFormat.size = 28;
			 
			/* Create a new Label component instance, set the textField.antiAliasType property,
			   set the embedFonts and textFormat styles, and add the label to the display list. */
			/*//var myLabel:Label = new Label();
			myLabel.width=500;
			myLabel.height=50;
			myLabel.text = "Hands on Learning";
			//myLabel.autoSize = TextFieldAutoSize.LEFT;
			//myLabel.move(10, 10);
			//myLabel.textField.antiAliasType = AntiAliasType.ADVANCED;
			//myLabel.setStyle("embedFonts", true);
			//myLabel.setStyle("textFormat", myTextFormat);
			myLabel.visible=true;
			movie1.addChild(myLabel);*/
		
		
			////////////////////////////////////
			
			movie1.addChild(image1);
			
			//button.x=50;
			//button.y=50;
			
			//button2.x=50;
			button2.y=70;
			
			//button2.x=50;
			button3.y=140;
			
			/*button.addEventListener(TouchEvent.MOUSE_DOWN,buttonDown);
			button2.addEventListener(TouchEvent.MOUSE_DOWN,button2Down);
			button3.addEventListener(TouchEvent.MOUSE_DOWN,button3Down);
			
			button.upState = drawButtonState(0xDAD8F3);
			button2.upState = drawButtonState(0xDAD8F3);
			button3.upState = drawButtonState(0xDAD8F3);
			
			button.overState = drawButtonState(0x4F42C6);
			button.downState = drawButtonState(0xDDF2FF);
			button.hitTestState = drawButtonState(0xDDF2FF);
			button.useHandCursor = true; */
			
			//movie1.addChild(button);
			//this.addChild(button2);
			//this.addChild(button3);
			
			//label.
			//var lb:Label= new Label();
			//var lb:Label = new Label(this, pb.x, pb.y - 20, "loading...");
			//myLabel.name="Hello World";
			myLabel.text = "Hello world";
			myLabel.width=300;
			myLabel.textField.background = true;
			myLabel.textField.backgroundColor = 0x000000;
			myLabel.visible=true;
			//myLabel.move(10, 10);
			//addChild(myLabel);
			//movie1.addChild(square);
			square.graphics.lineStyle(3,0x00ff00);
			square.graphics.beginFill(0x0000FF);
			square.graphics.drawRect(0,0,100,100);
			square.graphics.endFill();
			square.x=200;
			square.y=50;
			/*var square:Sprite = new Sprite();
addChild(square);
square.graphics.lineStyle(3,0x00ff00);
square.graphics.beginFill(0x0000FF);
square.graphics.drawRect(0,0,100,100);
square.graphics.endFill();
square.x = stage.stageWidth/2-square.width/2;
square.y = stage.stageHeight/2-square.height/2;*/
		movie1.addChild(buttonPlay);
		movie1.addChild(buttonInstructions);
		movie1.addChild(buttonExit);
		movie1.addChild(buttonBack);
		
        }
		
		
		function closeApp(event:TouchEvent):void
		{
     		 fscommand("quit");    
     	}
		
		function instructions(event:TouchEvent):void
		{
			myMaster.goToInstructions();
		}
		
		private function goToSelectAvatar(e:TouchEvent):void
		{
			myMaster.goToAvatar();
		}
		
		private function goToMain(e:TouchEvent):void
		{
			myMaster.goToFirstPage();
		}
		
		private function buttonDown(e:TouchEvent):void{
		
		// var curPt:Point=parent.globalToLocal(new Point(e.stageX,e.stageY));
          //  addBlob(e.ID, curPt.x, curPt.y);
            //e.stopPropagation();
			//button.alpha=0.5;
			removeChild(movie1);
			addChild(movie2);
			
			//button.upState = drawButtonState(0x4F42C6);
			//button.upState = drawButtonState(0x4F42C6);
		}
		private function imageMethod(e:TouchEvent):void{
		
		// var curPt:Point=parent.globalToLocal(new Point(e.stageX,e.stageY));
          //  addBlob(e.ID, curPt.x, curPt.y);
            //e.stopPropagation();
			//image1.alpha=0.5;
			removeChild(movie1);
			addChild(movie2);
			//button.upState = drawButtonState(0x4F42C6);
			//button.upState = drawButtonState(0x4F42C6);
		}
		private function button2Down(e:TouchEvent):void{
		
		// var curPt:Point=parent.globalToLocal(new Point(e.stageX,e.stageY));
          //  addBlob(e.ID, curPt.x, curPt.y);
            //e.stopPropagation();
			button2.alpha=0.5;
			//button.upState = drawButtonState(0x4F42C6);
			//button.upState = drawButtonState(0x4F42C6);
		}
		private function button3Down(e:TouchEvent):void{
		
		// var curPt:Point=parent.globalToLocal(new Point(e.stageX,e.stageY));
          //  addBlob(e.ID, curPt.x, curPt.y);
            //e.stopPropagation();
			button3.alpha=0.5;
			//button.upState = drawButtonState(0x4F42C6);
			//button.upState = drawButtonState(0x4F42C6);
		}
		private function drawButtonState(rgb:uint):Sprite {
		var sprite:Sprite = new Sprite();
		//sprite.graphics.lineStyle(4,0x33621E,1);
		sprite.graphics.beginFill(rgb);
		sprite.graphics.drawRoundRect(((this.stage.
		stageWidth/2)-(numButtonWidth/2)),((this.
		stage.stageHeight/2)-(numButtonHeight/2)),
		numButtonWidth,numButtonHeight,10,10);
		return sprite;
		}
 
        // updates/draws the drawn lines by:
        // cycling through all existing blobs
        // getting the id of each blob
        // use that id to get the line, as the lines are named after their blobs (eg line1280 )
        // tuioobj is the blob - see how it is called by request using the blob id?
        // if it is not there remove it from the blobs array.
        // draw the next segment of the line using lineTo and current loc (tuioobj.x, tuioobj.y)
        function updater(e:Event):void {
            for (var i:int = 0; i < blobs.length; i++) { 
                var tuioobj:TUIOObject=TUIO.getObjectById(blobs[i].id);
 
                // if not found, then it must have died..
                if (! tuioobj) {
                    removeBlob(blobs[i].id);
                } else if (parent != null) {
 
                    lines["line"+blobs[i].id].graphics.lineTo(tuioobj.x, tuioobj.y);
                }
            }
        }
		/*function start():void{
			var aButton:SimpleButton=new SimpleButton;
			

			aButton.addEventListener(MouseEvent.CLICK, clickHandler);
			//aButton.label = "Submit";
			addChild(aButton);
		}*/
 
        // when touched, this calls addblob with the blob ID and the X/Y of where it started
        public function downEvent(e:TouchEvent):void {
            var curPt:Point=parent.globalToLocal(new Point(e.stageX,e.stageY));
            addBlob(e.ID, curPt.x, curPt.y);
            e.stopPropagation();
        }
		
		function clickHandler(evtObj:MouseEvent){
		trace("The " + evtObj.target.label + " button was clicked");
		}
 
        // When a finger stops touching, call removeBlob
        public function upEvent(e:TouchEvent):void {
            removeBlob(e.ID);
            e.stopPropagation();
        }
 
        // This takes the sent ID, x,y and puts it all in the blobs array
        // It then creats a new sprite, and sets the starting loc of the line
        // The line is put in an array called lines, so it can be called over and over by name
        // if the lines did not have unique names you could only draw one line at a time
        // so each line is named in the array after the id of the blob (EG line1280)
        function addBlob(id:Number, origX:Number, origY:Number):void {
            blobs.push( {id: id, origX: origX, origY: origY, myOrigX: x, myOrigY:y} );
 
            var line:Sprite = new Sprite();
            lines["line"+id] = line;
            lines["line"+id].graphics.lineStyle(thickness, color); //<-- config above
            lines["line"+id].graphics.moveTo(origX, origY); //starting point of line to be drawn
            addChild(lines["line"+id]); // add line to stage
        }
 
        // when called, this function removes the blobs from the array
        // cycles through the blobs array until the blob is found by its ID, then it is removed.
        function removeBlob(id:Number):void {
            for (var i=0; i < blobs.length; i++) {
                if (blobs[i].id==id) {
                    blobs.splice(i, 1);
                    return;
                }
            }
        }
 
    }
}